<template>
	<view class="container">
		<view>
      <u-toast ref="uToast"></u-toast>
			<u-picker :show="show" ref="uPicker" :columns="columns" :title="title" @cancel="show = false"
				@confirm="confirm"></u-picker>
			<u-datetime-picker :minDate="newData" :show="dateTimeShow" mode="datetime" :title="title"
				@cancel="dateTimeShow = false" @confirm="checkDateTime"></u-datetime-picker>
			<u--form labelPosition="left" :model="from" :rules="rules" ref="form1" labelWidth='120px'
				:labelStyle='labelStyle'>
				<view class="title">
					基础信息
				</view>
				<view class="box">
					<u-form-item label="作业票名称" prop="zypmc" borderBottom>
						<u--input v-model="from.zypmc" placeholder="输入作业票名称" border="none"></u--input>
					</u-form-item>
					<u-form-item label="作业申请单位" prop="zysqdw" borderBottom @click="itemClick('zysqdw','作业申请单位')">
						<u--input v-model="from.zysqdw" placeholder="选择作业申请单位" border="none" disabled
							disabledColor="#ffffff"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="作业申请时间" prop="applyDate" borderBottom
						@click="dateTimeShow =true,dateTimeType=1,title='作业申请时间'">
						<u--input v-model="from.applyDate" placeholder="选择作业申请时间" border="none" disabled
							disabledColor="#ffffff"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="作业实施时间" prop="workImplementDate" borderBottom
						@click="dateTimeShow =true,dateTimeType=2,title='作业实施时间'">
						<u--input v-model="from.workImplementDate" placeholder="选择作业实施时间" border="none" disabled
							disabledColor="#ffffff"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<user-pick :label="'监护人'" :multiple="false" :placeholder="'请选择监护人'" v-model="from.jhr" :prop="'jhr'"></user-pick>
					<view style="color: #838383;padding: 10px 0">作业内容</view>
					<u--textarea v-model="from.zynr" placeholder="请输入..." height="120" confirmType="next"
						style="margin-bottom: 15px;background: #f6f6f6" count :maxlength="500"></u--textarea>
					<u-form-item label="作业地点" prop="zydd" borderBottom>
						<u--input v-model="from.zydd" placeholder="选择作业地点" border="none"></u--input>
					</u-form-item>
          <user-pick :label="'作业人'" :multiple="false" :placeholder="'请选择作业人'" :title="'作业人'" v-model="from.zyr" :prop="'jhr'"></user-pick>
					<u-form-item label="电工证号" prop="dgzh" borderBottom>
						<u--input v-model="from.dgzh" placeholder="输入电工证号" border="none"></u--input>
					</u-form-item>
					<u-form-item label="电源接入点" prop="dyjrd" borderBottom>
						<u--input v-model="from.dyjrd" placeholder="输入电源接入点" border="none"></u--input>
					</u-form-item>
					<u-form-item label="许可用电功率" prop="dyjrdjxkydgl" borderBottom>
						<u--input v-model="from.dyjrdjxkydgl" placeholder="输入电源接入点许可用电功率" border="none"></u--input>
					</u-form-item>
					<u-form-item label="工作电压" prop="gzdy" borderBottom>
						<u--input v-model="from.gzdy" placeholder="输入工作电压" border="none"></u--input>
					</u-form-item>
					<u-form-item label="用电设备" prop="ydsbmc" borderBottom>
						<u--input v-model="from.ydsbmc" placeholder="输入用电设备名称" border="none"></u--input>
					</u-form-item>
					<u-form-item label="额定功率" prop="edgl" borderBottom>
						<u--input v-model="from.edgl" placeholder="输入用电设备额定功率" border="none"></u--input>
					</u-form-item>
          <user-pick :label="'用电人'" :multiple="false" :placeholder="'请选择用电人'" :title="'用电人'" v-model="from.ydr" :prop="'ydr'"></user-pick>
        </view>
				<view class="title">
					关联特殊作业
				</view>
        <view class="box">
          <u-form-item label="关联特殊作业" prop="gltszy"  @click="itemClick('gltszy', '关联特殊作业')">
            <u--input v-model="from.gltszy" placeholder="选择关联特殊作业" border="none" disabled disabledColor="#ffffff"></u--input>
            <u-icon slot="right" name="arrow-right"></u-icon>
          </u-form-item>
        </view>

				<view class="title">
					气体检测
				</view>
				<view class="box">
					<u-form-item label="取样分析时间" prop="analysisDate" borderBottom @click="dateTimeShow =true,dateTimeType=3,title='取样分析时间'">
						<u--input v-model="from.analysisDate" placeholder="选择取样分析时间" border="none" disabled disabledColor="#ffffff"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="分析点" prop="fxd" borderBottom>
						<u--input v-model="from.fxd" placeholder="输入分析点" border="none"></u--input>
					</u-form-item>
          <view style="color: #838383;padding: 10px 0">可燃气体检测结果</view>
          <u--textarea v-model="from.krqtjcjg" placeholder="请输入..." height="120" confirmType="next"
                       style="margin-bottom: 15px;background: #f6f6f6" count :maxlength="500"></u--textarea>
          <user-pick :label="'分析人'" :multiple="false" :placeholder="'请选择分析人'" :title="'分析人'" v-model="from.fxr" :prop="'fxr'"></user-pick>

        </view>

				<view class="title">
					危害辨识-安全措施
				</view>
        <view class="box" style="padding-bottom: 6px">
          <u-form-item label="危害辨识" prop="text" borderBottom @click="toHazardousFactors">
            <u--input v-model="from.text" placeholder="选择危害因素" border="none" disabled
                      disabledColor="#ffffff"></u--input>
            <u-icon slot="right" name="arrow-right"></u-icon>
          </u-form-item>
          <view
              style="background:#f6f6f6;margin-bottom: 30px;border-radius:8px;height: 200px;overflow-y: auto">
            <u-checkbox-group v-model="from.  harm" placement="column" :labelSize='32'>
              <u-checkbox activeColor="#53c21d" v-for="(item,index) in from.  harm" :label="item.label"
                          :name="item.value" shape="circle" :key="index" style="padding: 10px 20px" :checked=true>
              </u-checkbox>
            </u-checkbox-group>
          </view>
          <u-form-item label="安全措施" prop="text" borderBottom @click="toSafetyMeasures">
            <u--input v-model="from.text" placeholder="选择安全措施" border="none" disabled
                      disabledColor="#ffffff"></u--input>
            <u-icon slot="right" name="arrow-right"></u-icon>
          </u-form-item>
          <view
              style="background:#f6f6f6;margin-bottom: 30px;border-radius:8px;height: 200px;overflow-y: auto">
            <u-checkbox-group v-model="from.safetyMeasures" placement="column" :labelSize='32'>
              <u-checkbox activeColor="#53c21d" v-for="(item,index) in from.safetyMeasures" :label="item.label"
                          :name="item.value" shape="circle" :key="index" style="padding: 10px 20px" :checked=true>
              </u-checkbox>
            </u-checkbox-group>
          </view>
          <u-form-item label="个人用品防护" prop="text" borderBottom @click="toProtection">
            <u--input v-model="from.text" placeholder="选择个人用品防护" border="none"></u--input>
            <u-icon slot="right" name="arrow-right"></u-icon>
          </u-form-item>
          <view
              style="background:#f6f6f6;margin-bottom: 30px;border-radius:8px;height: 200px;overflow-y: auto">
            <u-checkbox-group v-model="from.personalProtection" placement="column" :labelSize='32'>
              <u-checkbox activeColor="#53c21d" v-for="(item,index) in from.personalProtection" :label="item.label"
                          :name="item.value" shape="circle" :key="index" style="padding: 10px 20px" :checked=true>
              </u-checkbox>
            </u-checkbox-group>
          </view>
        </view>
				<view class="title">
					安全交底
				</view>
				<view class="box">
          <user-pick
              :label="'安全交底人'"
              :multiple="false"
              :title="'安全交底人'"
              :placeholder="'请选择安全交底人'"
              v-model="from.aqjdr"
              :prop="'aqjdr'"
          ></user-pick>
          <user-pick
              :label="'接受交底人'"
              :multiple="false"
              :title="'接受交底人'"
              :placeholder="'请选择接受交底人'"
              v-model="from.jsjdr"
              :prop="'jsjdr'"
          ></user-pick>
				</view>
<!--				<view class="title">-->
<!--					安全教育-->
<!--				</view>-->
<!--				<view class="box">-->
<!--          <user-pick-->
<!--              :label="'实施安全教育人'"-->
<!--              :multiple="false"-->
<!--              :title="'实施安全教育人'"-->
<!--              :placeholder="'请选择实施安全教育人'"-->
<!--              v-model="from.ssaqjyr"-->
<!--              :prop="'ssaqjyr'"-->
<!--          ></user-pick>-->
<!--          <u-form-item label="是否已实施" prop="sfyss" borderBottom @click="itemClick('sfyss', '是否已实施')">-->
<!--            <u&#45;&#45;input v-model="from.sfyss" placeholder="选择是否已实施" border="none" disabled disabledColor="#ffffff"></u&#45;&#45;input>-->
<!--            <u-icon slot="right" name="arrow-right"></u-icon>-->
<!--          </u-form-item>-->
<!--				</view>-->
				<view class="title">
					审核人/审核部门
				</view>
				<view class="box">
					<u-form-item label="作业指挥意见" prop="zyzhyj" borderBottom @click="itemClick('zyzhyj', '作业指挥意见')">
						<u--input v-model="from.zyzhyj" placeholder="选择作业指挥意见" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="所在单位" prop="szdw" borderBottom @click="itemClick('szdw','作业申请单位')">
						<u--input v-model="from.szdw" placeholder="选择所在单位" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
          <user-pick
              :label="'配送电单位意见'"
              :multiple="false"
              :title="'配送电单位意见'"
              :placeholder="'选择配送电单位审核人'"
              v-model="from.psddwyj"
              :prop="'psddwyj'"
          ></user-pick>
				</view>
				<view class="title">
					验收
				</view>
				<view class="box">
          <user-pick
              :label="'验收人'"
              :multiple="false"
              :title="'验收人'"
              :placeholder="'选择验收人'"
              v-model="from.ysr"
              :prop="'ysr'"
          ></user-pick>
				</view>
			</u--form>
			<u-button type="primary" text="申请" @click="submit" class='but'></u-button>
		</view>
	</view>
</template>

<script>
	import userPick from "@/pages/Components/userPick";
	import {
		getDepartmentAPI,
		aboutWorkAPI,
    electricalWorkAPI
	} from "@/api/api.js"
	export default {
		components: {
			userPick,
		},
		onShow() {
			let pages = getCurrentPages();
			let currPage = pages[pages.length - 1];
			let brand =currPage.brand
			if (!!brand) {
				if (brand.option) {
					this.from.harm = brand.option
          this.from.whbs = brand.optionList.toString()
				} else if (brand.list) {
					this.from.safetyMeasures = brand.list
          this.from.aqcs = brand.idList.toString()
        } else if (brand.fh) {
					this.from.personalProtection = brand.fh
					this.from.grypfh = brand.fhlist.toString()
        }
			}
		},
		data() {
			return {
				show: false,
				dateTimeShow: false,
				title: '',
				temKey: '',
				dateTimeType: 0,
				columns: [],
				newData: new Date().getTime(),
				labelStyle: {
					color: '#666'
				},
				from: {
					text: '',
					zypmc: '',
					zynr:'',
					dgzh:'',
          zydd:'',
          dyjrd:'',
          dyjrdjxkydgl:'',
          gzdy:'',
          gltszy:'',
          fxsj:'',
          analysisDate:'',
          fxd:'',
          krqtjcjg:'',
          harm:[],
          whbs:'',
          workImplementDate:'',
          safetyMeasures:[],
          personalProtection:[],
          aqcs:'',
          grypfh:''
        },
				rules: {},
				obj: {
          'sfyss': [['未实施','已实施']],
          'zyzhyj':[['非计划性','计划性']],
        }
			};
		},
		methods: {
      submit() {
        this.from.ydsbmcjedgl = this.from.ydsbmc + this.from.edgl
        electricalWorkAPI({...this.from}).then((r)=>{
          if(r.code === 200){
            this.$refs.uToast.show({
              type: "success",
              message: "申请成功",
              iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
            });
            setTimeout((e)=>{
              uni.navigateBack({
                delta:1
              })
            },1000)
          }
        })
      },
			itemClick(key, title) {
				if (key === 'zysqdw' || key === 'zydw' || key === 'szdw') {
					this.show = true
					this.title = title
					this.temKey = key
					getDepartmentAPI({}).then((r) => {
						let msg = r.data.map((e) => {
							return e.deptName
						})
						this.columns = [msg]
					})
				}else if (key === 'gltszy'){
          this.show = true
          this.title = title
          this.temKey = key
          aboutWorkAPI({}).then((r) => {
            let msg = r.data.map((e) => {
              return e.zypmc
            })
            this.columns = [msg]
          })
        } else {
					this.show = true
					this.title = title
					this.temKey = key
					this.columns = this.obj[key]
				}
			},
			confirm(e) {
				this.from[this.temKey] = e.value[0]
				// this.from[this.temKey]==='待实施'?this.from.sfyss='0':this.from.sfyss='1'
				this.show = false
			},
			checkDateTime(e) {
				const timeFormat = uni.$u.timeFormat
				switch (this.dateTimeType) {
					case 1:
						this.from.applyDate = timeFormat(e.value, 'yyyy-mm-dd hh:MM')
						this.from.zysqsj = timeFormat(e.value, 'yyyymmddhhMM')
						break;
					case 2:
						this.from.workImplementDate = timeFormat(e.value, 'yyyy-mm-dd hh:MM')
						this.from.zysssj = timeFormat(e.value, 'yyyymmddhhMM')
						break;
          case 3:
            this.from.analysisDate = timeFormat(e.value, 'yyyy-mm-dd hh:MM')
            this.from.fxsj = timeFormat(e.value, 'yyyymmddhhMM')
            break;
				}
				this.dateTimeShow = false
			},
      toProtection() {
        uni.navigateTo({
          url: '../HotWork/protection/protection'
        })
      },
      toHazardousFactors() {
        uni.navigateTo({
          url: '../HotWork/hazardousFactors/hazardousFactors'
        })
      },
      toSafetyMeasures() {
        uni.navigateTo({
          url: '../HotWork/safetyMeasures/safetyMeasures'
        })
      },
		}
	}
</script>

<style lang="scss">
	.container {
		padding: 0 24rpx;
		background-color: #f6f6f6;

		.title {
			font-size: 28rpx;
			font-weight: 500;
			color: #999999;
			line-height: 44rpx;
			padding: 20rpx 48rpx;
		}

		.box {
			padding: 0rpx 48rpx;
			background-color: #fff;
			border-radius: 20rpx;
		}
	}

	.but {
		margin: 30rpx 0;
	}
</style>
